$(function () {
    // 1. 全选 全不选功能模块
    //      就是把全选按钮（checkall）的状态赋值给 三个小的按钮（j-checkbox）就可以了
    //      事件可以使用change
    $(".checkall").change(function () {
        // console.log($(this).prop('checked'));
        $('.j-checkbox, .checkall').prop("checked", $(this).prop('checked'))

        getSum()
    })
    // 2. 如果小复选框被选中的个数等于3 就应该把全选按钮选上，否则全选按钮不选。
    $(".j-checkbox").change(function () {
        // if(被选中的小的复选框的个数 === 3) {
        //     就要选中全选按钮
        // } else {
        //     不要选中全选按钮
        // }
        // console.log($(".j-checkbox:checked").length);
        // $(".j-checkbox").length 这个是所有的小复选框的个数
        // if ($(".j-checkbox:checked").length === $(".j-checkbox").length) {
        //     $(".checkall").prop("checked", true);
        // } else {
        //     $(".checkall").prop("checked", false); 
        // }
        // 简化写法
        $(".checkall").prop("checked", $(".j-checkbox:checked").length === $(".j-checkbox").length);

        getSum()
    })

    // 3. 增减商品数量模块 首先声明一个变量，当我们点击+号（increment），就让这个值++，然后赋值给文本框。
    // 3.1 加号的点击事件
    $(".increment").click(function () {
        //得到当前兄弟文本框的值
        let num = $(this).siblings('.itxt').val()

        // 更改数量，后运算，在改值
        num++

        // 赋值给它的上一个兄弟
        $(this).siblings('.itxt').val(num)

        // 找到爷爷的兄弟
        // console.log($(this).parents('.p-num').siblings('.p-price'));

        // 获取的是带有人民币符号的，如何去除人民币符号？==》 substring  
        // 还可以借助于replace来实现  replace 替换 把 ￥ 替换成 ''
        // let price = $(this).parents('.p-num').siblings('.p-price').html().substring(1)
        let price = $(this).parents('.p-num').siblings('.p-price').html().replace('￥', '')

        // 更改小计的html
        $(this).parents('.p-num').siblings('.p-sum').html(`￥${(price * num).toFixed(2)}`)

        getSum()
    })

    // 3.2 减号的点击事件
    $(".decrement").click(function () {
        //得到当前兄弟文本框的值
        let num = $(this).siblings('.itxt').val()

        // 更改数量，后运算，在改值
        num--

        // 判断条件 限制数字不能大于等于0，如果输入大于或等于0则给提示 结束函数
        if (num <= 0) {
            return alert('商品数量最少为一个')
        }

        // 赋值给它的上一个兄弟
        $(this).siblings('.itxt').val(num)

        // 找到爷爷的兄弟
        // console.log($(this).parents('.p-num').siblings('.p-price'));

        // 获取的是带有人民币符号的，如何去除人民币符号？==》 substring  
        // 还可以借助于replace来实现  replace 替换 把 ￥ 替换成 ''
        let price = $(this).parents('.p-num').siblings('.p-price').html().substring(1)
        // let price = $(this).parents('.p-num').siblings('.p-price').html().replace('￥', '')

        // 更改小计的html
        $(this).parents('.p-num').siblings('.p-sum').html(`￥${(price * num).toFixed(2)}`)

        getSum()
    })




    // 4. 用户修改文本框的值 计算 小计模块
    $('.itxt').change(function() {
        // 先得到文本框的里面的值 乘以 当前商品的单价
        let num = $(this).val()

        // 当前商品的单价
        let price = $(this).parents('.p-num').siblings('.p-price').html().substring(1)

        // 更改小计的html
        $(this).parents('.p-num').siblings('.p-sum').html(`￥${(price * num).toFixed(2)}`)

        getSum()
    })


    getSum()

    // 总数量：封装函数：因为删除会影响到总价，商品数量的改变会影响到总价
    function getSum() {
        let count = 0 //计算总件数
        let money = 0 //计算总价钱

        $('.j-checkbox:checked').each(function (i, item) {

            count += +$(item).parent().siblings('.p-num').find('input').val()

            money += +$(item).parent().siblings('.p-sum').text().substring(1)
        })

         // 放入内容
         $('.amount-sum em').text(count)
         $('.price-sum em').text(`￥${money.toFixed(2)}`)
    }

    // 5. 删除商品模块
    // (1) 商品后面的删除按钮
    $('.p-action a').click(function() {
        // 删除的是当前的商品
        $(this).parents('.cart-item').remove()

        getSum()
    })
    // (2) 删除选中的商品
    $('.remove-batch').click(function() {
        // 删除的是小的复选框中的商品
        $('.j-checkbox:checked').parents('.cart-item').remove()
        getSum()
    })
    // (3) 清空购物车 删除全部商品
    $('.clear-all').click(function() {
        $(".cart-item").remove()
        getSum()
    })
})
